<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>利用document的方法修改元素的内容</title>
		<script>
			function modifyShuai()
			{
				var d=document.getElementById("handsome");
				//alert(d.innerHTML);
				//d.innerHTML="<h1 style='font-size:6px'>陈国运最帅！</h1>";
				var name=document.getElementsByName("shuaige")[0].value;
				
				d.innerHTML=name+" 最帅！";
			}
			function clearWin()
			{
				document.body.innerHTML="";
				document.body.bgColor="red";
			}
		</script>
	</head>
	<body>
		<input type="text" name="shuaige" placeholder="请输入帅哥名字"/>
		<div id="handsome" >
			<h1 style="color: red;font-size:100px">我们班，张洋最帅！</h1>
		</div>
		<input type="button" value="修改" onclick="modifyShuai()">
		<input type="button" value="清空本网页" onclick="clearWin()"/>
	</body>
</html>
